<!--######################################## empty 内容为空
**组件名：leruge-empty

内容为空主要用于列表数据为空的时候提示。

安装方式
本组件符合easycom规范，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

基本用法
在 template 中使用组件

<leruge-empty text="暂无数据" type="minus"></leruge-empty>
API
Badge Props
属性名	类型	默认值	说明
text	String	暂无数据	文字提示
type	String	minus	uni-icons图标
margin-top	Number	0	距离上一个元素距离
show	Boolean	true	是否显示 -->


<template>
	<view class="leruge-empty" v-if="show" :style="{
		marginTop: marginTop + 'rpx'
	}">
		<!-- <uni-icons size="43" :type="type" color="#c0c4cc"></uni-icons> -->
		<view class="">
			<image :style="{width:width, height:height}" src="../../static/empty.png" mode=""></image>
		</view>
		<view style="margin-top: 20rpx;">
			<text style="color: #c0c4cc;font-size: 28rpx;">{{text}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: "leruge-empty",
		props: {
			width:{
				type:String,
			}, 
			height:{
				type:String
			},
			// 提示文字
			text: {
				type: String,
				default: '暂无数据'
			},
			// 选择uni-icons图片
			type: {
				type: String,
				default: 'minus'
			},
			// 组件距离上一个元素之间的距离
			marginTop: {
				type: [String, Number],
				default: 0
			},
			// 是否显示组件
			show: {
				type: Boolean,
				default: true
			}
		}
	}
</script>

<style scoped lang="scss">
	.leruge-empty {
		/* #ifndef APP-NVUE */
		display: flex;
		flex-direction: row;
		/* #endif */
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 100%;
		padding-bottom: 100rpx;
	}
</style>